<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>

    <meta name="description" content="描述">
    <meta name="keywords" content="关键词">
    <link rel="icon" href="">
    <link rel="shortcut icon" href="">
    <link rel="stylesheet" href="/web/public/css/public.css">
  <link rel="stylesheet" href="/web/public/css/header.css">
  <link rel="stylesheet" href="/web/public/css/footer.css">
  <link rel="stylesheet" href="/web/public/css/my-collection.css">
  <link rel="stylesheet" href="/web/public/css/aside.css">
    <!--    <link rel="stylesheet" href="//at.alicdn.com/t/font_2052942_xzk2q3ix0w.css">-->
    <title>我的收藏</title>
    <script src="/web/lib/jquery-1.12.4.min.js"></script>
    <script src="/web/public/public.js"></script>
    <script src="/web/lib/jquery.pagination.js"></script>
</head>
<body>
<div class="container">
    <!--这里引入header-->
    <include file="/web/html/header/header.htm" page-type="1"></include>
    <div id="main">
        <div class="aside-wrap">
            <include file="/web/html/fragment/personal-center/aside.htm"></include>
        </div>
        <div class="list-wrap">
            <div class="tab-list">
                <div class="tab-item">
                    我的收藏
                </div>
            </div>
            <ul class="content-list">
            </ul>
            <div class="list-pagination"></div>
        </div>
    </div>
    <include file="/web/html/footer/footer.htm"></include>
</div>
<script>
    $(function () {
        $('#personal-center-aside .aside-list .collection').addClass('active');
        function getTagList(pageNum,resetPage){
            var pageSize = 10;
            $.ajax({
                url: ports.getMyCollection,
                data: {
                    pageNum:pageNum,
                    pageSize:pageSize
                },
                success:function(res) {
                    console.log('获取我的收藏',res);
                    if(res.status==200){
                        var tagListHtml = '';
                        var tagList = res.data.list;
                        if(tagList&&tagList.length){
                            $.each(tagList,function (i,item) {
                                var keywordsListHtml = '';
                                if(item.articleKeywords){
                                    item.articleKeywords.forEach(function (item1) {
                                        keywordsListHtml += '<a href='+ '/web/html/list/tags-list.html?id='+item1.value+' class="tag">'+ item1.label +'</a>'
                                    })
                                }

                                tagListHtml += '<li>\n' +
                                    (item.articleImage ?'<div class="left"><img src='+ item.articleImage  +' alt='+ item.articleTitle +'></div>':'')
                                    +
                                    '                    <div class="right">\n' +
                                    '                        <div class="title"><a target="_blank" href='+ item.articleUrl +'>'+ item.articleTitle +'</a></div>\n' +
                                    '                        <p>\n' + item.articleInfo +
                                    '                        </p>\n' +
                                    '                        <div class="info">\n' +
                                    '                            <i class="iconfont icon-shijian"></i><span>'+ item.createTime.substr(0,10) +'</span>\n' +
                                    '\n'
                                    + keywordsListHtml +
                                    '                        </div>\n' +
                                    '                    </div>\n' +
                                    '                </li>'
                            })
                            $('ul.content-list').html(tagListHtml);
                            if(resetPage){
                                $('.list-pagination').pagination({
                                    prevContent: '< 上一页',
                                    nextContent: '下一页 >',
                                    totalData: res.data.total,
                                    showData: pageSize,
                                    coping: true,
                                    callback: function (api) {
                                        console.log(api.getCurrent());
                                        var current = api.getCurrent();
                                        document.body.scrollTop = 0;
                                        document.documentElement.scrollTop = 0;
                                        getTagList(current,false);
                                    }
                                });
                            }
                        }
                    }
                }
            });
        }

        getTagList(1,true);
    })
</script>
</body>
</html>